<template>
    <lay-container :fluid="true" style="padding: 10px;padding-top: 10px;">
        <lay-card style="padding:10px;">
            <lay-row>
                <lay-col :md="24" :md-offset="0" ref="layFormRef1">
                    <lay-form :model="configs">
                        <lay-tab type="brief" v-model="current2">
                            <lay-tab-item title="系统信息" id="1">
                                <lay-form-item label="系统名称" prop="siteName">
                                    <lay-col md="6">
                                        <lay-input v-model="configs.siteName"></lay-input>
                                    </lay-col>
                                    <lay-col md="6" class="tip">系统名称</lay-col>
                                </lay-form-item>
                                <lay-form-item label="使用单位" prop="unitOfUse">
                                    <lay-col md="6">
                                        <lay-input v-model="configs.unitOfUse"></lay-input>
                                    </lay-col>
                                    <lay-col md="6" class="tip">是谁在使用</lay-col>
                                </lay-form-item>
                                <lay-form-item label="系统地址" prop="siteUrl">
                                    <lay-col md="6">
                                        <lay-input v-model="configs.siteUrl"></lay-input>
                                    </lay-col>
                                    <lay-col md="6" class="tip">如：https://www.cxuu.top</lay-col>
                                </lay-form-item>

                                <lay-form-item label="系统描述" prop="description">
                                    <lay-col md="8">
                                        <lay-textarea placeholder="请输入描述" v-model="configs.description">
                                        </lay-textarea>
                                    </lay-col>
                                </lay-form-item>
                                <lay-form-item label="系统版权" prop="copyright">
                                    <lay-col md="8">
                                        <lay-input v-model="configs.copyright"></lay-input>
                                    </lay-col>
                                </lay-form-item>
                                <lay-form-item label="备案号" prop="beian">
                                    <lay-col md="6">
                                        <lay-input v-model="configs.beian"></lay-input>
                                    </lay-col>
                                </lay-form-item>
                            </lay-tab-item>

                            <lay-tab-item title="上传设置" id="2">
                                <lay-form-item label="上传主目录" prop="baseDir">
                                    <lay-col md="5">
                                        <lay-input v-model="configs.baseDir"></lay-input>
                                    </lay-col>
                                    <lay-col md="6" class="tip">如：uploads</lay-col>
                                </lay-form-item>
                                <lay-field title="图片"></lay-field>
                                <lay-form-item label="图片目录" prop="imageDir">
                                    <lay-col md="5">
                                        <lay-input v-model="configs.imageDir"></lay-input>
                                    </lay-col>
                                    <lay-col md="6" class="tip">Images</lay-col>
                                </lay-form-item>

                                <lay-form-item label="图片类型" prop="imageExt">
                                    <lay-col md="8">
                                        <lay-input v-model="configs.imageExt"></lay-input>
                                    </lay-col>
                                    <lay-col md="6" class="tip">如：.jpg,gif,png</lay-col>
                                </lay-form-item>
                                <lay-form-item label="图片大小" prop="imageSize">
                                    <lay-col md="4">
                                        <lay-input v-model="configs.imageSize"></lay-input>
                                    </lay-col>
                                    <lay-col md="6" class="tip">单位：KB</lay-col>
                                </lay-form-item>
                                <lay-field title="附件"></lay-field>
                                <lay-form-item label="附件目录" prop="fileDir">
                                    <lay-col md="5">
                                        <lay-input v-model="configs.fileDir"></lay-input>
                                    </lay-col>
                                    <lay-col md="6" class="tip">如：Files</lay-col>
                                </lay-form-item>
                                <lay-form-item label="文件类型" prop="fileExt">
                                    <lay-col md="8">
                                        <lay-input v-model="configs.fileExt"></lay-input>
                                    </lay-col>
                                    <lay-col md="6" class="tip">如：.txt,.zip,.7z,.doc,docx,.xls,.xlsx</lay-col>
                                </lay-form-item>
                                <lay-form-item label="文件大小" prop="fileSize">
                                    <lay-col md="4">
                                        <lay-input v-model="configs.fileSize"></lay-input>
                                    </lay-col>
                                    <lay-col md="6" class="tip">单位：KB，如：2000</lay-col>
                                </lay-form-item>
                            </lay-tab-item>

                            <lay-tab-item title="其它" id="3">
                                <lay-field title="CMS"></lay-field>
                                <lay-form-item label="CMS缓存开关" prop="cmsCache">
                                    <lay-col md="5" class="tip">
                                        <lay-switch v-model="configs.cmsCache" onswitch-text="启用"
                                            unswitch-text="禁用"></lay-switch>
                                    </lay-col>
                                </lay-form-item>
                                <lay-form-item label="默认缓存时间" prop="cmsCacheTime">
                                    <lay-col md="4">
                                        <lay-input-number v-model="configs.cmsCacheTime"></lay-input-number>
                                    </lay-col>
                                    <lay-col md="20" class="tip">单位秒：600 等于10分钟，根据模板配合设置，以上开关启用后生效</lay-col>
                                </lay-form-item>

                                <lay-field title="后台登录验证码"></lay-field>
                                <lay-form-item label="验证码开关" prop="validCode">
                                    <lay-col md="5" class="tip">
                                        <lay-switch v-model="configs.validCodeOn" onswitch-text="启用"
                                            unswitch-text="禁用"></lay-switch>
                                    </lay-col>
                                </lay-form-item>
                                <lay-form-item label="验证码样式" prop="validCode">
                                    <lay-col md="16">
                                        <lay-radio v-model="configs.validCodeType" name="action" :value="1" label="gif英文数字"></lay-radio>
                                        <lay-radio v-model="configs.validCodeType" name="action" :value="2" label="gif泡泡"></lay-radio>
                                        <lay-radio v-model="configs.validCodeType" name="action" :value="3" label="英文数字"></lay-radio>
                                        <lay-radio v-model="configs.validCodeType" name="action" :value="4" label="中文泡泡（默认）"></lay-radio>
                                    </lay-col>
                                    <lay-col md="8" class="tip"></lay-col>
                                </lay-form-item>
                            </lay-tab-item>
                        </lay-tab>
                        <lay-form-item>
                            <lay-button @click="submitClick" type="primary" v-permission="PerKey.Config_Edit"
                                prefix-icon="layui-icon-ok">保存
                            </lay-button>
                        </lay-form-item>
                    </lay-form>
                </lay-col>
            </lay-row>
        </lay-card>
    </lay-container>
</template>

<script lang="ts" setup>
import { ref } from "vue";
import { layer } from "@layui/layer-vue";
import { configIndex, upconfig } from "../../../api/module/config"
import { useConfigStore } from '../../../store/config';
import { PerKey } from "../../../library/permissionConst"
import { Config } from "../../../types/config";
let configs = ref(<Config><unknown>[])

configIndex().then((res) => {
    if (res.status == 1) {
        configs.value = res.data.data;
    } else {
        layer.msg('获取信息失败', { icon: 2 });
        return false;
    }
});
const current2 = ref("1")
const submitClick = function () {
    upconfig(configs.value).then((res) => {
        if (res.status == 1) {
            layer.msg(res.msg, { time: 1000, icon: 1 }, async () => {
                const configStore = useConfigStore();
                configStore.systemConfig = configs.value
            });
        } else {
            layer.msg(res.msg, { icon: 2 });
            return false;
        }
    });
};
</script>

<style scoped>
.tip {
    color: gray;
    line-height: 38px;
    height: inherit;
    padding-left: 10px;
}
</style>